<template>
    <div>
      <ul>
        <li @click="gotode(picList.houseCode)">
            <div class="pic">
                <img :src="picList.houseImg" alt="">
            </div>
            <div class="txt">
                <div class="title">{{picList.desc}}</div>
                <span>{{picList.price}}</span>
                 <div class="ppic">{{picList.title}}</div>
            </div>
        </li>
      </ul> 
    </div>
</template>

<script>
export default {
    props: {
      id:"",
      picList:{
        type:Object,
        default:()=> ({})
      }
    },
    data() {
        return {

        };
    },
    components: {

    },
    methods: {
      
      // 点击某个房屋列表时触发的
      gotode(id) {
        // 给 具体 房屋 详情 传参
        this.$router.push(`/detail?id=${id}`)
      }
    },
    computed: {

    },
    created() {

    },
    mounted() {

    },
    watch: {

    },
};
</script>

<style scoped>
ul {
  display: flex;
  flex-flow: wrap;
  justify-content: center;

}
li { 
  padding-top: 18px;
    height: 120px;
    width: 345px;
    border-bottom: .5px  solid #e5e5e5;
    margin:0 0 6px 0;
    display: flex;
    justify-content: space-between;
}
li .pic {
  width: 106px;
  height: 80px;
}
li .pic img {
  width: 100%;
  height: 100%;
}
.txt {
    width: 200px;
    height: 100%;
}
.pic {
    width: 100px;
    height: 100px;
}
img {
    width: 100%;
    height: 100%;
}
</style>
